Skip to content

fix: Add backwards compatability with canvas provider#3773

Open
mannycarrera4 wants to merge 19 commits intoWorkday:prerelease/majorfrom
mannycarrera4:mc-forward-theming
Open

fix: Add backwards compatability with canvas provider#3773
mannycarrera4 wants to merge 19 commits intoWorkday:prerelease/majorfrom
mannycarrera4:mc-forward-theming

Conversation

@mannycarrera4
Copy link
Contributor

@mannycarrera4 mannycarrera4 commented Feb 18, 2026

Summary

Fixes: #3747

Release Category

Components

Release Note

We've added backwards compatibility to CanvasProvider to customize theming via the theme prop even though our components now use semantic brandable tokens. Consumers should only use this approach when creating a scoped theme intended to break away from global theming.


Checklist

For the Reviewer

  • PR title is short and descriptive
  • PR summary describes the change (Fixes/Resolves linked correctly)
  • PR Release Notes describes additional information useful to call out in a release message or removed if not applicable
  • Breaking Changes provides useful information to upgrade to this code or removed if not applicable

Where Should the Reviewer Start?

Areas for Feedback? (optional)

  • Code
  • Documentation
  • Testing
  • Codemods

Testing Manually

Screenshots or GIFs (if applicable)

Thank You Gif (optional)

@cypress
Copy link

cypress bot commented Feb 18, 2026

Workday/canvas-kit    Run #10460

Run Properties:  status check passed Passed #10460  •  git commit 6c92c4e0da ℹ️: Merge 01d3b47a98de3a0905ef006e223cf0d7fe63dc1b into c1e47138d21bc585aa2ff384b90c...
Project Workday/canvas-kit
Branch Review mc-forward-theming
Run status status check passed Passed #10460
Run duration 02m 24s
Commit git commit 6c92c4e0da ℹ️: Merge 01d3b47a98de3a0905ef006e223cf0d7fe63dc1b into c1e47138d21bc585aa2ff384b90c...
Committer Manuel Carrera
View all properties for this run ↗︎

Test results
Tests that failed  Failures 0
Tests that were flaky  Flaky 0
Tests that did not run due to a developer annotating a test with .skip  Pending 15
Tests that did not run due to a failure in a mocha hook  Skipped 0
Tests that passed  Passing 790
View all changes introduced in this branch ↗︎
UI Coverage  19.37%
  Untested elements 1530  
  Tested elements 365  
Accessibility  99.38%
  Failed rules  5 critical   5 serious   0 moderate   2 minor
  Failed elements 67  

@mannycarrera4 mannycarrera4 moved this to 🏗 In progress in Canvas Kit Feb 23, 2026
@mannycarrera4 mannycarrera4 added the ready for review Code is ready for review label Feb 24, 2026
@mannycarrera4 mannycarrera4 marked this pull request as ready for review February 24, 2026 20:57
@jaclynjessup jaclynjessup moved this from 🏗 In progress to 👀 In review in Canvas Kit Feb 25, 2026
@RayRedGoose RayRedGoose requested a review from Copilot February 25, 2026 17:48
Copy link
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR adds backwards compatibility to CanvasProvider for customizing theming via the theme prop. It addresses issue #3747 where the old theme format (e.g., brand.primary.base) doesn't work with the new semantic brand token system (e.g., brand.primary.600 and system.color.brand.*). The implementation creates mappings from deprecated theme palette keys to both legacy brand tokens and new numerical/system brand tokens.

Changes:

  • Added comprehensive token mapping logic in CanvasProvider to forward theme values from old palette format to new brand and system tokens
  • Updated popup theming to apply CSS variables earlier and remove cleanup to prevent theme flashing
  • Updated documentation and examples to demonstrate scoped theming with the new backwards-compatible approach

Reviewed changes

Copilot reviewed 7 out of 7 changed files in this pull request and generated 16 comments.

Show a summary per file
File Description
modules/react/common/lib/CanvasProvider.tsx Core backwards compatibility logic with mappings from deprecated palette keys to numerical brand tokens and system tokens
modules/react/popup/lib/hooks/usePopupStack.ts Refactored theme application timing and removed cleanup to prevent cascade barriers and theme flashing
modules/react/popup/stories/visual-testing/Popup.stories.tsx Updated PopupThemed story to properly test themed popup with trigger button
modules/react/common/stories/mdx/examples/Theming.tsx Updated example to demonstrate scoped theming with CanvasProvider theme prop
modules/react/common/stories/mdx/Theming.mdx Extensive documentation updates explaining v14/v15 theming approach and backwards compatibility
modules/docs/mdx/15.0-UPGRADE-GUIDE.mdx Added section explaining system brand tokens and backwards compatibility
modules/docs/llm/upgrade-guides/15.0-UPGRADE-GUIDE.md Added section explaining system brand tokens and backwards compatibility

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

mannycarrera4 and others added 3 commits February 26, 2026 16:09
Copy link
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Copilot reviewed 8 out of 8 changed files in this pull request and generated 7 comments.


💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

ready for review Code is ready for review

Projects

Status: 👀 In review

Development

Successfully merging this pull request may close these issues.

3 participants